<!DOCTYPE html>
<html>
<head>
	<title>参赛名单</title>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1,maximum-scale=1,user-scalable=no" />
	<meta content="yes" name="apple-mobile-web-app-capable">
	<meta content="yes" name="apple-touch-fullscreen">
	<meta content="telephone=no,email=no" name="format-detection">
	<link rel="stylesheet" href="http://www.youyiku-yishu.cn/Apps/WebApp/View/default/css/common.css?v={$WST_V}">
	<link rel="stylesheet" href="http://www.youyiku-yishu.cn/Apps/WebApp/View/default/css/normalize.css" type="text/css">
	<link rel="stylesheet" href="http://www.youyiku-yishu.cn/Apps/WebApp/View/default/css/book.css" type="text/css">
	<link rel="stylesheet" href="http://www.youyiku-yishu.cn/Apps/WebApp/View/default/css/MemoryCup/Entrylist.css" type="text/css">
</head>
<body>
<div>
	<h1>参赛名单</h1>
	<div class="Head">
		<span>参赛姓名</span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span>学校名称</span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span>作品名称</span>
	</div>
</div>
<div>
	
</div>
<div class="Body" id="B1">
	<!--<ul>
		<li>鲁班</li>
		<li>春秋大学</li>
		<li>鲁班七号</li>
	</ul>
	<ul>
		<li>鲁班</li>
		<li>春秋大学</li>
		<li>鲁班七号</li>
	</ul>
	<ul>
		<li>鲁班</li>
		<li>春秋大学</li>
		<li>鲁班七号</li>
	</ul>-->
	
</div>
<div id="pages"> 
		
	</div>
	
	<include file="__ROOT__Apps/WebApp/View/default/common_footer.html" />
</body>
<script type="text/javascript" src="http://www.youyiku-yishu.cn/Apps/WebApp/View/default/js/ajax.js"></script>
<script type="text/javascript" src="http://www.youyiku-yishu.cn/Apps/WebApp/View/default/js/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="http://www.youyiku-yishu.cn/Apps/WebApp/View/default/js/jisuan.js"></script>
<script>
	var divPages=document.getElementById("pages");
	divPages.onclick=e=>{
	var tar=e.target;
    if(tar.nodeName=="A"
      &&!tar.className.endsWith("disabled")
      &&tar.className!="current"){
      switch(tar.innerHTML){
        case "上一页": break;
        case "下一页": break;
        default: load(tar.innerHTML);
      }  
    }
}
	 var pno="";
	function load(pno=1){
		console.log(pno);
		//这里没传页码给后台
			$.ajax({
			type: "get",//数据发送的方式（post 或者 get）
			url: " {:U('WxBooks/match')}",//要发送的后台地址
			data:{'pno':pno},//要发送的数据（参数）格式为{'val1':"1","val2":"2"}
			dataType: "json",//后台处理后返回的数据格式
			success:output=>{
				var data=output.data;
				var html="";
    		for(var p of data){
//  			console.log(data)
			     html+=
				`<ul>
				<li> ${p.realname }</li>
				<li> ${p.college }</li>
				<li>${p.bookname }</li>
				</ul>`
			    }
    document.getElementById("B1").innerHTML=html;
   	  var pno=output.pno,pageCount=output.pageCount;
      var html=`<a href="javascript:;" id="dd"class="previous ${pno==1?'disabled':''}"id="Pre">上一页</a>`;
      for(var i=1;i<=pageCount;i++){
        html+=`<a href="javascript:;" class="${pno==i?'current':''}">${i}</a>`;
      }
      html+=`<a href="javascript:;" class="next ${pno==pageCount?'disabled':''}">下一页</a>`;
      divPages.innerHTML=html;
      $divPages.html(html);
		$divPages.children(":eq("+(pageNo+1)+")").addClass("current");

//		checkAStatus($divPages,pageCount,pageNo);

		//divPages.onclick=function(){...}
		       //.addEventListener("click")
		$divPages.off("click").click(e=>{//为divPages绑定单击事件
			var $tar=$(e.target);
			console.log("单击");
			if($tar.is("a")){//如果目标元素是a
				//如果a不是divPages的第一个子元素和最后一个子元素
				if(!$tar.is(":first-child,:last-child")){
					//如果当前a的class不是current
					if(!$tar.is(".current")){
						//获得当前a的内容-1，保存在pno中
						var pno=$tar.html()-1;
						//调用loadProducts(pno)重新加载第pno页
						load(pno);
					}
				}else{
					//如果class不以disabled结尾
					if(!$tar.is(".disabled")){
						//在divPages下查找class为current的a
						var $curr=
							$divPages.children(".current");
						//如果class以next开头
						if($tar.is(".next")){
							//重新加载商品列表传入current的内容作为pno
							load($curr.html());
						}else{
							load($curr.html()-2);
						}
					}
				}
			}
		})
   
		}
	})
}; 

load();

</script>
</html>
